<!-- 代码的仿控制台(暂时弃用) -->
<script setup>
import {ref,defineProps,defineEmits} from "vue"

const props = defineProps({
    lineCommand:{type:String},
})

const emits = defineEmits(['overSignal'])

const commandLineValue = ref('')
const isResult = ref(false)
const isCommandLinePrint = ref(false)

const commandInputRef = ref(null)

window.onkeyup = (event) => {
    // console.log(event.keyCode)
    if(event.keyCode == 13){
        if(commandLineValue != ''){
            isResult.value = false
        }else{
            isResult.value = true
            emits('overSignal',{success:'success'})
        }
    }
}

</script>

<template>
    <div class="lineCommand">
        <div class="commandName">
            <div class="biaodian">$</div>
            <div class="biaodianName">my-go ></div>
        </div>
        <div class="inputBoxCommand">
            <input type="text" v-model="commandLineValue" ref="commandInputRef"/>
        </div>
    </div>
    <div v-if="isResult" class="lineCommandResult">
        <div v-if="isCommandLinePrint" class="isCommandLine">
        </div>
    </div>
</template>

<style scoped>
.lineCommand,
.lineCommandResult{
    width: 100%;
    height: 10%;
    display: flex;
    align-items: center;
}
.commandName{
    margin-left: 10px;
    display: flex;
    color: #fff;
}
.biaodian{
    color: rgba(0, 200, 200, 1);
}
.inputBoxCommand{
    position: relative;
    left: 0;
    width:50%;
    height: 50%;
    border: none;
    outline: none;
    background: none;
}
.inputBoxCommand input{
    width: 100%;
    height: 100%;
    border: none;
    outline: none;
    background: none;
    caret-color:#fff;/**修改光标颜色 */
    color: #fff;/**修改字体颜色 */
    font-size: 15px;
}
</style>